<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>font-face 自定义字体图标</title>
    <link rel="stylesheet" href="./fonts/demo.css">
    <link rel="stylesheet" href="./fonts/iconfont.css">
    <!-- 自定义字体图标 -->
    <style>
        /* 加载速度慢 */
        @font-face {
            font-family: 'iconfont';
            /* // Project id 2784047   */
            src: url('//at.alicdn.com/t/font_2784047_kvy21tbwdp.woff2?t=1631502180396') format('woff2'),
                url('//at.alicdn.com/t/font_2784047_kvy21tbwdp.woff?t=1631502180396') format('woff'),
                url('//at.alicdn.com/t/font_2784047_kvy21tbwdp.ttf?t=1631502180396') format('truetype');
        }

        /* @font-face {
            font-family: 'iconfont';
            src: url('./fonts/iconfont.eot');
            src: url('./fonts/iconfon.eot?#iefix') format('embedded-opentype'),
                url('./fonts/iconfon.woff') format('woff'),
                url('./fonts/iconfon.ttf') format('truetype'),
                url('./fonts/iconfon.svg#iconfont') format('svg');
        } */


        .iconfont {
            font-family: "iconfont" !important;
            font-size: 16px;
            font-style: normal;
            -webkit-font-smoothing: antialiased;
            -webkit-text-stroke-width: 0.2px;
            -moz-osx-font-smoothing: grayscale;
        }
    </style>
</head>

<body>
    <i class="iconfont">&#xe669;</i>
    <i class="iconfont">&#xe63b;</i>
    <i class="iconfont">&#xe663;</i>
    <i class="iconfont">&#xe664;</i>
    <i class="iconfont">&#xe665;</i>
    <i class="iconfont">&#xe63b;</i>
</body>

</html>